<template>
  <div class="employeesDetail" v-loading="homeLoading">
    <section class="header clearfix">
      <div class="back">
        <i class="iconfont iconfanhui1" @click="goBack()"></i>
        <span @click="goBack()">{{ $route.query.companyName ? $route.query.companyName + "/" : ""
          }}{{ fullName }}</span>
      </div>
    </section>
    <!--入职/离职-->
    <div class="leave clearfix" v-if="auditInfo.auditStatus == '1'">
      <div class="normal" v-if="userDetail.jobStatus == 1">
        <i class="iconfont icontongzhi"></i>{{ userDetail.jobFirstTime | dateFilter }}入职转正
      </div>
      <div class="normal" v-else-if="userDetail.jobStatus == 2">
        <i class="iconfont icontongzhi"></i>{{ userDetail.jobFirstTime | dateFilter }}试用
      </div>
      <div class="message" v-else-if="userDetail.jobStatus == 3">
        <i class="iconfont icontongzhi"></i>该员工已离职
      </div>
      <!--操作-->
      <section class="leave-pointer">
        <span class="reset" @click="entryWork(1)" v-if="userDetail.jobStatus == 3">
          <i class="iconfont icontubiaozhizuomoban-97"></i>重新雇佣
        </span>
        <span class="reset" @click="entryWork(2)" v-if="userDetail.jobStatus == 1">
          <i class="iconfont icontubiaozhizuomoban-99"></i>解雇
        </span>
        <span class="reset" @click="entryWork(3)" v-if="userDetail.jobStatus == 2">
          <i class="iconfont icontubiaozhizuomoban-97"></i>转正
        </span>
      </section>
    </div>
    <!--审核信息-->
    <div class="p-t-lg" v-if="auditInfo.auditStatus != '1'">
      <header style="margin-bottom: 20px">
        <div class="title">审核信息</div>
      </header>
      <el-timeline>
        <el-timeline-item v-for="(activity, index) in remarkList" :key="index" :timestamp="activity.time">
          {{ activity.remark }}
        </el-timeline-item>
      </el-timeline>
    </div>

    <!--基本信息-->
    <div class="p-t-lg" style="padding: 10px 22px">
      <div class="main clearfix">
        <el-divider content-position="left" style="font-size: 8px;">基本信息</el-divider>
        <el-descriptions direction="vertical" :column="4" size="mini" border>
          <el-descriptions-item label="姓名 *"><el-input :disabled="auditInfo.auditStatus == '1'"
              v-model="userDetail.fullName" placeholder="在这里输入姓名" size="mini"
              clearable></el-input></el-descriptions-item>
          <el-descriptions-item label="身份证 *"><el-input :disabled="auditInfo.auditStatus == '1'"
              v-model="userDetail.idCardNo" placeholder="在这里输入身份证" maxlength="18" @change="idCardChange"
              size="mini"></el-input></el-descriptions-item>
          <el-descriptions-item label="民族 *">
            <el-select v-model.trim="userDetail.nation" filterable :disabled="auditInfo.auditStatus == '1'"
              placeholder="请选择" size="mini">
              <el-option v-for="(item, index) in nationOptions" :key="index" :label="item" :value="item"></el-option>
            </el-select>
          </el-descriptions-item>
          <el-descriptions-item label="性别 *">
            <el-select v-model.trim="userDetail.gender" :disabled="auditInfo.auditStatus == '1'" placeholder="请选择"
              size="mini">
              <el-option v-for="item in sexOptions" :key="item.value" :label="item.label"
                :value="item.value"></el-option>
            </el-select>
          </el-descriptions-item>

          <el-descriptions-item label="手机号 *"><el-input :disabled="auditInfo.auditStatus == '1'" placeholder="在这里输入手机号"
              v-model.trim="userDetail.phoneNumber" maxlength="11" clearable
              size="mini"></el-input></el-descriptions-item>
          <el-descriptions-item label="户籍类型 *">
            <el-select v-model="userDetail.typeOfHouseholdRegistration" :disabled="auditInfo.auditStatus == '1'"
              placeholder="请选择" size="mini">
              <el-option v-for="item in censusOptions" :key="item.value+''" :label="item.label"
                :value="item.value+''"></el-option>
            </el-select>
          </el-descriptions-item>
          <el-descriptions-item label="参保身份 *">
            <el-select v-model="userDetail.insuredStatus" :disabled="auditInfo.auditStatus == '1'" filterable
              placeholder="请选择" size="mini">
              <el-option v-for="(item, index) in insuredStatusOptions" :key="index" :label="item"
                :value="item"></el-option>
            </el-select>
          </el-descriptions-item>
          <el-descriptions-item label="职工工种 *">
            <el-select v-model="userDetail.typeOfWork" :disabled="auditInfo.auditStatus == '1'" filterable
              placeholder="请选择" size="mini">
              <el-option v-for="(item, index) in typeOfWorkOptions" :key="index" :label="item"
                :value="item"></el-option>
            </el-select>
          </el-descriptions-item>

          <el-descriptions-item label="户籍地址 *">
            <el-input placeholder="户籍地址" :disabled="auditInfo.auditStatus == '1'"
              v-model.trim="userDetail.registeredAddress" clearable size="mini"></el-input>
          </el-descriptions-item>
          <el-descriptions-item label="最高学历 *">
            <el-select v-model.trim="userDetail.highestAcademicQualifications" :disabled="auditInfo.auditStatus == '1'"
              filterable placeholder="请选择" size="mini">
              <el-option v-for="item in educationOptions" :key="item.value+''" :label="item.label"
                :value="item.value+''"></el-option>
            </el-select>
          </el-descriptions-item>
          <el-descriptions-item label="联系地址 *" :span="2">
            <el-input placeholder="在这里输入联系地址" :disabled="auditInfo.auditStatus == '1'"
              v-model.trim="userDetail.contactAddress" clearable size="mini" style="width: 80%"></el-input>
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </div>
    <!--社保/公积金-->
    <div class="p-t-lg">
      <header class="clearfix">
        <el-divider content-position="left" style="font-size: 8px;">缴纳项控制</el-divider>
        <div class="is-open" v-if="userDetail.jobStatus != 3 && auditInfo.auditStatus != 0">
          <el-switch v-model="isEdit" active-text="开启编辑" size="mini" inactive-text="关闭编辑">
          </el-switch>
        </div>
      </header>
      <div class="main clearfix">
        <div class="input-box-max">
          <el-descriptions :column="3" size="mini" border>
            <el-descriptions-item label="缴纳项目 *" :span="3">
              <el-checkbox v-model="isPaySocialSecurity" :disabled="userDetail.jobStatus == 3 || !isEdit"
                size="mini">社保</el-checkbox>
              <el-checkbox v-model="isPayMedical" :disabled="userDetail.jobStatus == 3 || !isEdit"
                size="mini">医保</el-checkbox>
              <el-checkbox v-model="isPayFund" :disabled="userDetail.jobStatus == 3 || !isEdit"
                size="mini">公积金</el-checkbox>
              <el-checkbox v-model="isWages" :disabled="userDetail.jobStatus == 3 || !isEdit"
                size="mini">工资</el-checkbox>
              <el-checkbox v-model="associatedContracts" :disabled="userDetail.jobStatus == 3 || !isEdit" 
              size="mini">合同</el-checkbox>
            </el-descriptions-item>

            <el-descriptions-item label="当地社保 *">
              <el-select v-model="userDetail.localSocialSecurity" :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请选择" size="mini">
                <el-option v-for="item in isLocalSocialSecurityOptions" :key="item.value" :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-descriptions-item>
            <el-descriptions-item label="缴纳城市 *">
              <el-select v-model="userDetail.areaCode" @change="getPlatform"
                :disabled="userDetail.jobStatus == 3 || !isEdit" placeholder="请选择" filterable size="mini">
                <el-option v-for="item in cityOptions" :key="item.areaCode" :label="item.areaName"
                  :value="item.areaCode"></el-option>
              </el-select>
            </el-descriptions-item>
            <el-descriptions-item label="缴纳平台 *">
              <el-select v-model="userDetail.platformId" :disabled="userDetail.jobStatus == 3 || !isEdit"
                placeholder="请选择" size="mini">
                <el-option v-for="item in platformOptions" :key="item.platformId+''" :label="item.platformName"
                  :value="item.platformId+''"></el-option>
              </el-select>
            </el-descriptions-item>
          </el-descriptions>
        </div>


        <div class="input-box-max" v-show="isPaySocialSecurity">
          <el-divider content-position="left" style="font-size: 8px;">社保(养老、失业、工伤、残保金)</el-divider>
          <div>
            <el-descriptions direction="vertical" :column="5" size="mini" border>
              <el-descriptions-item label="社保账号"><el-input :disabled="userDetail.jobStatus == 3 || !isEdit"
                  v-model="userDetail.socialSecurityAccount" placeholder="输入社保账号"
                  size="mini"></el-input></el-descriptions-item>
              <el-descriptions-item label="社保起缴月份">
                <el-date-picker v-model="userDetail.socialSecurityDate" :disabled="userDetail.jobStatus == 3 || !isEdit"
                  type="month" format="yyyy 年 MM 月" value-format="yyyy-MM" size="mini" placeholder="选择月份"
                  :picker-options="pickerOptions"></el-date-picker>
              </el-descriptions-item>
              <el-descriptions-item label="社保基数"><el-input :disabled="userDetail.jobStatus == 3 || !isEdit"
                  v-model="userDetail.socialSecurityBasic" placeholder="输入社保基数" size="mini"><template
                    slot="append">元</template></el-input>
                <div class="data-range" v-if="socialSecurityBasicValMin > 0 && socialSecurityBasicValMax > 0">
                  取值范围：{{ socialSecurityBasicValMin }}~{{ socialSecurityBasicValMax }}
                </div>
              </el-descriptions-item>

              <el-descriptions-item
                label="社保养老企业支付">{{ ((userTemplate.companyRetirementRate / 100) || 0) * (userDetail.socialSecurityBasic || 0) }}元</el-descriptions-item>
              <el-descriptions-item
                label="社保养老个人支付">{{ ((userTemplate.personRetirementRate / 100) || 0) * (userDetail.socialSecurityBasic || 0) }}元</el-descriptions-item>

              <el-descriptions-item
                label="社保失业公司支付">{{ (((userTemplate.companyUnemploymentRate / 100) || 0) * (userDetail.socialSecurityBasic || 0)) }}元</el-descriptions-item>
              <el-descriptions-item
                label="社保失业个人支付">{{ (((userTemplate.personUnemploymentRate / 100) || 0) * (userDetail.socialSecurityBasic || 0)) }}元</el-descriptions-item>
              <el-descriptions-item
                label="社保工伤公司支付">{{ (((userTemplate.companyNdustrialInjuryRate / 100) || 0) * (userDetail.socialSecurityBasic || 0)) }}元</el-descriptions-item>
              <el-descriptions-item
                label="社保残保金公司支付">{{ (((userTemplate.companyDisabilityBenefitsRate / 100) || 0) * (userDetail.socialSecurityBasic || 0)) }}元</el-descriptions-item>
            </el-descriptions>
          </div>
        </div>
        <div class="input-box-max" v-show="isPayMedical">
          <el-divider content-position="left" style="font-size: 8px;">医保</el-divider>
          <el-descriptions direction="vertical" :column="3" size="mini" border>
            <el-descriptions-item label="医保基数"><el-input v-model="userDetail.medicalInsuranceBase"
                :disabled="userDetail.jobStatus == 3 || !isEdit" placeholder="输入医保基数" size="mini"><template
                  slot="append">元</template></el-input></el-descriptions-item>
            <el-descriptions-item
              label="医保企业支付">{{ (((userTemplate.companyMedicalRate / 100) || 0) * (userDetail.medicalInsuranceBase || 0)) }}元</el-descriptions-item>
            <el-descriptions-item
              label="医保个人支付">{{ (((userTemplate.personMedicalRate / 100) || 0) * (userDetail.medicalInsuranceBase || 0)) }}元</el-descriptions-item>
          </el-descriptions>
        </div>
        <div class="input-box-max" v-show="isPayFund">
          <el-divider content-position="left" style="font-size: 8px;">公积金</el-divider>
          <el-descriptions direction="vertical" :column="5" size="mini" border>
            <el-descriptions-item label="公积金账号"><el-input v-model="userDetail.fundAccount"
                :disabled="userDetail.jobStatus == 3 || !isEdit" placeholder="输入公积金账号"
                size="mini"></el-input></el-descriptions-item>
            <el-descriptions-item label="公积金起缴月份">
              <el-date-picker :disabled="userDetail.jobStatus == 3 || !isEdit" v-model="userDetail.fundDate"
                type="month" format="yyyy 年 MM 月" value-format="yyyy-MM" placeholder="选择月份"
                :picker-options="fundPickerOptions" size="mini">
              </el-date-picker>
            </el-descriptions-item>
            <el-descriptions-item label="公积金基数"><el-input v-model="userDetail.fundBasic"
                :disabled="userDetail.jobStatus == 3 || !isEdit" placeholder="输入公积金基数" size="mini"><template
                  slot="append">元</template></el-input>
              <div class="data-range" v-if="fundBasicValMin > 0 && fundBasicValMax > 0">
                取值范围：{{ fundBasicValMin }}~{{ fundBasicValMax }}
              </div>
            </el-descriptions-item>
            <el-descriptions-item
              label="公积金企业支付">{{ (((userTemplate.companyFundRate / 100) || 0) * (userDetail.fundBasic || 0)) }}元</el-descriptions-item>
            <el-descriptions-item
              label="公积金个人支付">{{ (((userTemplate.personFundRate / 100) || 0) * (userDetail.fundBasic || 0)) }}元</el-descriptions-item>
          </el-descriptions>
        </div>
      </div>
      <div class="input-box-max" v-show="isWages">
        <el-divider content-position="left" style="font-size: 8px;">工资</el-divider>
        <el-descriptions :column="1" size="mini" border>
          <el-descriptions-item label="工资">
            <el-input placeholder="在这里输入工资" v-model.trim="userDetail.basicWages"
              :disabled="userDetail.jobStatus == 3 || !isEdit" clearable size="mini"><template
                slot="append">元</template></el-input>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <div class="input-box-max" v-show="associatedContracts">
        <el-divider content-position="left" style="font-size: 8px;">关联合同</el-divider>
        <el-descriptions :column="4" size="mini" border>
          <el-descriptions-item label="合同编号">
            <el-input placeholder="在这里输入合同编号" v-model.trim="userDetail.contractNumber" 
            :disabled="userDetail.jobStatus == 3 || !isEdit" clearable size="mini" ></el-input>
          </el-descriptions-item>
          <el-descriptions-item label="合同开始日期">
            <el-date-picker placeholder="合同开始日期" type="date" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd"
            :disabled="userDetail.jobStatus == 3 || !isEdit" v-model="userDetail.laborContractStart" :picker-options="laborContractPickerOptions" clearable size="mini" >
                            </el-date-picker>
          </el-descriptions-item>
          <el-descriptions-item label="合同结束日期">
            <el-date-picker placeholder="在这里输入合同结束日期" type="date" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" 
            :disabled="userDetail.jobStatus == 3 || !isEdit" v-model="userDetail.laborContractEnd" :picker-options="laborContractPickerOptions" clearable size="mini" >
            </el-date-picker>
          </el-descriptions-item>
          <el-descriptions-item label="用工协议类型">
            <el-select :disabled="userDetail.jobStatus == 3 || !isEdit" v-model="userDetail.employmentAgreementType" filterable placeholder="请选择" size="mini" >
              <el-option v-for="item in employmentAgreementTypeOptions" :key="item.employmentAgreementTypeId" :label="item.employmentAgreementTypeName" :value="item.employmentAgreementTypeId"></el-option>
            </el-select>
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </div>

    <!--证件照片/扫描件-->
    <div class="p-t-lg">
      <header class="clearfix">
        <div class="title">证件照片/扫描件</div>
      </header>
      <div class="main">
        <div class="clearfix">
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading2" @click="showImg(0)">
              <el-image v-if="userDetail.idCardFrontPhotoPath" style="width: 100%; height: 100%"
                :src="userDetail.idCardFrontPhotoPath" :preview-src-list="srcList"></el-image>
            </div>
            <p>身份证正面照片(头像面)</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 2)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading3" @click="showImg(1)">
              <el-image v-if="userDetail.idCardBackPhotoPath" style="width: 100%; height: 100%"
                :src="userDetail.idCardBackPhotoPath" :preview-src-list="srcList"></el-image>
            </div>
            <p>身份证反面照片(国徽面)</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 3)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading4" @click="showImg(2)">
              <el-image v-if="userDetail.residenceBookMainPath" style="width: 100%; height: 100%"
                :src="userDetail.residenceBookMainPath" :preview-src-list="srcList"></el-image>
            </div>
            <p>户口本主页</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 4)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-bj" v-loading="isLoading5" @click="showImg(3)">
              <el-image v-if="userDetail.residenceBookPersonalPath" style="width: 100%; height: 100%"
                :src="userDetail.residenceBookPersonalPath" :preview-src-list="srcList"></el-image>
            </div>
            <p>户口本个人页</p>
            <ul>
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 5)" />
              </li>
            </ul>
          </div>
          <div class="img-box">
            <div class="img-head" v-loading="isLoading1" @click="showImg(4)">
              <el-image v-if="userDetail.personPhotoPath" style="width: 100%; height: 100%"
                :src="userDetail.personPhotoPath" :preview-src-list="srcList"></el-image>
            </div>
            <p>二寸白底免冠照</p>
            <ul class="tip-head">
              <li class="upBtn" v-if="userDetail.jobStatus != 3">
                上传
                <input type="file" name="" id="" @change="upImg($event, 1)" />
              </li>
            </ul>
          </div>
        </div>
        <ul class="explain">
          <li>说明</li>
          <li>1.照片中证件不可以被遮挡，需清晰看到文字信息</li>
          <li>2.照片中证件需为原件，请勿上传复印件照片</li>
          <li>3.仅支持jpg, jpeg, png格式的图片</li>
        </ul>
      </div>
    </div>
    <div class="button-box">
      <el-button @click="goBack()">返回</el-button>
      <!--未通过审核-新增-->
      <!-- <el-button
        type="primary"
        v-if="auditInfo.auditStatus == '2' && userDetail.jobStatus != 3"
        :loading="submitLoading"
        @click="reSubmit()"
      >
        重新提交
      </el-button> -->
      <!--其他-->
      <el-button type="primary" v-if="userDetail.jobStatus != 3 && auditInfo.auditStatus != 0 && isEdit"
        :loading="submitLoading" @click="submit()">
        保存
      </el-button>
    </div>

    <!--新增对话框-->
    <el-dialog title="新增缴纳项目" :visible.sync="dialogFormVisible" :close-on-click-modal="false"
      :close-on-press-escape="false" :show-close="false" center width="600px">
      <el-form :model="form">
        <el-form-item label="项目类别" :label-width="formLabelWidth">
          <el-select v-model="form.companyPaymentId" @change="paymentChange" placeholder="请选择">
            <el-option v-for="item in itemClassification" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmAdd()">确 定</el-button>
      </div>
    </el-dialog>

    <!--修改对话框-->
    <el-dialog title="编辑缴纳项目" :visible.sync="dialogEdit" :close-on-click-modal="false" :close-on-press-escape="false"
      :show-close="false" width="600px" center>
      <el-form :model="form">
        <el-form-item label="缴纳项目" :label-width="formLabelWidth">
          <el-select v-model="form.companyPaymentId" disabled placeholder="请选择">
            <el-option v-for="item in areaPaymentOptions" :key="item.companyPaymentId" :label="item.paymentName"
              :value="item.companyPaymentId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="缴纳方式" :label-width="formLabelWidth">
          <el-select v-model="form.paymentType" @change="typeChange" disabled placeholder="请选择">
            <el-option v-for="item in paymentTypeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item v-if="form.paymentType == 0" label="默认值" :label-width="formLabelWidth">
          <el-input v-model="form.defaultVal" disabled placeholder="请输入默认值" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="基数" v-if="form.paymentType == 1" :label-width="formLabelWidth">
          <el-input v-model="form.basic" clearable placeholder="请输入基数"><template slot="append">元</template></el-input>
        </el-form-item>
        <p class="tip" v-if="form.paymentType == 1">
          提示：基数取值范围必须在{{ form.baseValMin }}~{{ form.baseValMax }}之间
        </p>
        <el-form-item label="公司比例" v-if="form.paymentType == 1" :label-width="formLabelWidth">
          <el-input v-model="form.companyVal" suffix-icon="iconfont iconbaifenbi" placeholder="请输入公司比例"
            disabled></el-input>
        </el-form-item>
        <el-form-item label="个人比例" v-if="form.paymentType == 1" :label-width="formLabelWidth">
          <el-input v-model="form.personVal" suffix-icon="iconfont iconbaifenbi" placeholder="请输入个人比例"
            disabled></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogEdit = false">取 消</el-button>
        <el-button type="primary" @click="confirmUpdate()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import base from "@/assets/js/base";
import commonData from "@/assets/js/commonData";
import { requestApiPost, requestApiFilePost } from "../api/api";
import { reqRep } from "../report/reqReport";
import { resRep } from "../report/resReport";
export default {
  name: "employeesDetail",
  data() {
    return {
      remarkList: [],
      //设置日期组件
      pickerOptions: {
        // disabledDate(time) {
        //   //获取上个月的毫秒数
        //   let date = new Date();
        //   let pDate = new Date(
        //     date.getFullYear(),
        //     date.getMonth() - 1,
        //     date.getDate()
        //   ).getTime();
        //   return time.getTime() > Date.now() || time.getTime() < pDate;
        // },
        disabledDate(time) {
          //获取下个月的毫秒数
          let date = new Date();
          let nDate = new Date(
            date.getFullYear(),
            date.getMonth() + 1,
            date.getDate()
          ).getTime();
          return time.getTime() > nDate;
        },
      },
      laborContractPickerOptions: {
        disabledDate(time) {
          //获取下个月的毫秒数
          let date = new Date();
          let nDate = new Date(
            date.getFullYear(),
            date.getMonth() + 1,
            date.getDate()
          ).getTime();
          return time.getTime() > nDate;
        },
      },
      fundPickerOptions: {
        // disabledDate(time) {
        //   //获取上个月的毫秒数
        //   let date = new Date();
        //   let pDate = new Date(date.getFullYear(), 1, 0).getTime();
        //   let nDate = new Date(date.getFullYear() + 1, 0, 0).getTime();
        //   return time.getTime() < pDate || time.getTime() > nDate;
        // },
        disabledDate(time) {
          //获取下个月的毫秒数
          let date = new Date();
          let nDate = new Date(
            date.getFullYear(),
            date.getMonth() + 1,
            date.getDate()
          ).getTime();
          return time.getTime() > nDate;
        },
      },
      isEdit: false, //是否可编辑
      fullName: "",
      dialogEdit: false,
      dialogFormVisible: false,
      homeLoading: false,
      loading: false,
      submitLoading: false,
      isLoading5: false,
      isLoading1: false,
      isLoading2: false,
      isLoading3: false,
      isLoading4: false,
      updateLoading: false,
      addLoading: false,
      infoDialog: false,
      auditInfo: {},

      /*
        --是否缴纳公众金
        isPayFund: true,
        --是否缴纳工资
        isWages: true,
        --是否缴纳社保
        isPaySocialSecurity: true,
        --是否缴纳医保
        isPayMedical: true,
      */
      isPayFund: true,
      isWages: true,
      isPaySocialSecurity: true,
      isPayMedical: true,
      associatedContracts:true,

      //用户信息
      userDetail: {
        fullName: "",//姓名
        idCardNo: "",//身份证
        nation: "汉族",//民族
        gender: 1,//性别
        phoneNumber: "",//手机号
        censusRegisterType: 1,//户籍类型
        insuredStatus: 0,//参保身份
        typeOfWork: 0,//职工工种
        registeredAddress: "",//户籍地址
        highestAcademicQualifications: 0,//最高学历
        contactAddress: "",//联系地址

        localSocialSecurity: 0,//当地社保
        areaCode: "",//缴纳城市
        platformId: 0,//缴纳平台
        /*社保*/
        socialSecurityAccount: "",//社保账号
        socialSecurityBasic: "",//社保基数
        socialSecurityDate: "",//社保起缴月份
        companyRetirementRate: "",//社保养老企业支付
        personRetirementRate: "",//社保养老个人支付
        companyUnemploymentRate: "",//社保失业公司支付
        personUnemploymentRate: "",//社保失业个人支付
        companyNdustrialInjuryRate: "",//社保工伤公司支付
        companyDisabilityBenefitsRate: "",//社保残保金公司支付
        /*医保*/
        medicalInsuranceBase: "",//医保基数
        companyMedicalRate: "",//医保企业支付
        personMedicalRate: "",//医保个人支付
        /*公积金*/
        fundAccount: "",//公积金账号
        fundBasic: "",//公积金基数
        companyFundRate: "",//公积金企业支付
        personFundRate: "",//公积金个人支付
        fundDate: "",//公积金起缴月份
        /*工资*/
        wages: "",//工资
        /*合同*/
        contractNumber:"",//合同编号
        laborContractStart:"",//合同开始日期
        laborContractEnd:"",//合同结束日期
        employmentAgreementType:"",//用工协议类型（1：劳务派遣，2：非劳务派遣）
        /*证件照片*/
        idCardFrontPhotoPath:"",//身份证正面照片(头像面)
        idCardBackPhotoPath:"",//身份证反面照片(国徽面)
        residenceBookMainPath:"",//户口本主页
        residenceBookPersonalPath:"",//户口本个人页
        personPhotoPath:"",//二寸白底免冠照

      },
      userTemplate:{
        /*社保*/
        socialSecurityAccount:"",//社保账号
        socialSecurityBasic:"",//社保基数
        socialSecurityDate:"",//社保起缴月份
        companyRetirementRate:"",//社保养老企业支付
        personRetirementRate:"",//社保养老个人支付
        companyUnemploymentRate:"",//社保失业公司支付
        personUnemploymentRate:"",//社保失业个人支付
        companyNdustrialInjuryRate:"",//社保工伤公司支付
        companyDisabilityBenefitsRate:"",//社保残保金公司支付
        /*医保*/
        medicalInsuranceBase:"",//医保基数
        companyMedicalRate:"",//医保企业支付
        personMedicalRate:"",//医保个人支付
        /*公积金*/
        fundAccount:"",//公积金账号
        fundBasic:"",//公积金基数
        companyFundRate:"",//公积金企业支付
        personFundRate:"",//公积金个人支付
        fundDate:"",//公积金起缴月份
        /*工资*/
        wages:"",//工资
      },

      employmentAgreementTypeOptions:[
        {
          employmentAgreementTypeId:1,
          employmentAgreementTypeName:"劳务派遣"
        },
        {
          employmentAgreementTypeId:2,
          employmentAgreementTypeName:"非劳务派遣"
        }
      ],
      areaPaymentOptions: [],
      formLabelWidth: "160px",
      form: {},
      srcList: [],
      imgList: [],
      platformOptions: [],
      isLocalSocialSecurityOptions: [
        {
          value: 0,
          label: "交过",
        },
        {
          value: 1,
          label: "未交过",
        },
      ],
      sexOptions: [
        {
          value: 1,
          label: "男",
        },
        {
          value: 2,
          label: "女",
        },
      ],
      isPayFund: true,
      isPaySocialSecurity: true,
      cityOptions: [],
      paymentTypeOptions: [
        {
          value: "0",
          label: "值",
        },
        {
          value: "1",
          label: "比例",
        },
      ],
      censusOptions: [],
      paymentOptions: [
        {
          value: "1",
          label: "各缴",
        },
        {
          value: "2",
          label: "公司全缴",
        },
      ],
      educationOptions: [],
      basicInfoTable: [], //缴纳基数列表
      inOrOut: "",
      itemClassification: [],
      socialSecurityBasicValMax: "",
      socialSecurityBasicValMin: "",
      fundBasicValMax: "",
      fundBasicValMin: "",
      insuredStatusOptions: [],
      typeOfWorkOptions: [],
      nationOptions: [],
    };
  },
  methods: {
    //根据身份证获取性别
    idCardChange(idCard) {
      if (base.isCardId(idCard)) {
        let sex = base.getSexByIdCard(idCard);
        this.$set(this.userDetail, "sex", sex);
      }
    },
    //处理合计
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }

        if (column.property == "companyAmount" || column.property == "personAmount") {
          const values = data.map((item) => Number(item[column.property]));
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return base.accAdd(prev, curr);
            } else {
              return prev;
            }
          }, 0);
          sums[index] += " 元";
        }
      });

      return sums;
    },
    //确认新增缴纳项目
    confirmAdd() {
      if (this.baseList.length > 0) {
        for (let index = 0; index < this.baseList.length; index++) {
          for (let j = 0; j < this.basicInfoTable.length; j++) {
            if (this.baseList[index].paymentId == this.basicInfoTable[j].paymentId) {
              this.$message.warning("缴纳项目重复，请重新选择");
              return;
            }
          }
          this.baseList[index].type = "add";
        }

        this.addLoading = true;

        this.basicInfoTable = [...this.basicInfoTable, ...this.baseList];

        this.basicInfoTable = this.basicInfoTable
          .filter((e) => {
            if (!this.isPaySocialSecurity) {
              return e.paymentItemType != "1";
            } else {
              return e;
            }
          })
          .filter((e) => {
            if (!this.isPayFund) {
              return e.paymentItemType != "2";
            } else {
              return e;
            }
          });

        for (let index = 0; index < this.baseList.length; index++) {
          //社保赋值
          if (this.baseList[index].paymentItemType == "1") {
            if (this.baseList[index].paymentType === "1") {
              //没有社保基数直接赋值
              if (!this.userDetail.socialSecurityBasic) {
                this.$set(
                  this.userDetail,
                  "socialSecurityBasic",
                  this.baseList[index].basic
                );
              }
            }
            if (this.baseList[index].paymentType === "0") {
              if (!this.userDetail.socialSecurityBasic) {
                this.$set(
                  this.userDetail,
                  "socialSecurityBasic",
                  this.baseList[index].defaultVal
                );
              }
            }
            //社保范围
            this.socialSecurityBasicValMax = this.baseList[index].baseValMax || 0;
            this.socialSecurityBasicValMin = this.baseList[index].baseValMin || 0;
          }

          //公积金赋值
          if (this.baseList[index].paymentItemType == "2") {
            if (this.baseList[index].paymentType === "1") {
              if (!this.userDetail.fundBasic) {
                this.$set(this.userDetail, "fundBasic", this.baseList[index].basic);
              }
            }
            if (this.baseList[index].paymentType === "0") {
              if (!this.userDetail.fundBasic) {
                this.$set(this.userDetail, "fundBasic", this.baseList[index].defaultVal);
              }
            }

            //公积金范围
            this.fundBasicValMax = this.baseList[index].baseValMax || 0;
            this.fundBasicValMin = this.baseList[index].baseValMin || 0;
          }
        }

        this.dialogFormVisible = false;
        this.getPaymentAmount();
      } else {
        this.$message.warning("该项目类别没有缴纳项目");
      }
    },
    //确认修改缴纳项目
    confirmUpdate() {
      if (!this.form.paymentType || !this.form.companyPaymentId) {
        this.$message.warning("信息不完整");
        return;
      }
      if (this.form.paymentType == 0) {
        if (!this.form.defaultVal) {
          this.$message.warning("请输入默认值");
          return;
        }
      } else {
        if (!this.form.basic || !this.form.companyVal || !this.form.personVal) {
          this.$message.warning("请输入比例");
          return;
        }
        if (
          Number(this.form.basic) < Number(this.form.baseValMin) ||
          Number(this.form.basic) > Number(this.form.baseValMax)
        ) {
          this.$message.warning("基数错误，请输入范围中的值");
          return;
        }
      }
      let data = JSON.parse(JSON.stringify(this.form));

      if (!data.type || data.type != "add") {
        data.type = "edit";
      }

      let index = this.basicInfoTable.findIndex((e) => {
        return e.paymentId == data.paymentId;
      });

      this.basicInfoTable.splice(index, 1, data);
      this.dialogEdit = false;
      this.getPaymentAmount();
    },

    //修改社保起缴月份
    socialMonthChange() { },
    typeFilter(a, b, c) {
      if (c == 1) {
        return "比例";
      } else {
        return "值";
      }
    },
    defaultValFormatter(a, b, c) {
      if (c > 0) {
        return c;
      } else {
        return "-";
      }
    },

    //选择缴纳方式
    typeChange(e) {
      if (e == 0) {
        this.form.basic = "";
        this.form.companyVal = "";
        this.form.personVal = "";
      } else {
        this.form.defaultVal = "";
      }
    },
    //重新雇佣
    entryWork(inOrOut) {
      let personIds = [this.$route.query.personId];
      var reqData = {
        personIds: personIds,
        companyId:
          this.$route.query.companyId ||
          JSON.parse(sessionStorage.getItem("login")).personId,
        inOrOut: inOrOut, // 1入职；2离职；3转正
      };
      let reqReport = reqRep({
        traCode: "_IN_OUT_JOB",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "操作成功",
            type: "success",
          });
          setTimeout(() => {
            this.goBack();
          }, 1000);
        }
      });
    },
    //展示指定图片
    showImg(i) {
      this.srcList = [];
      this.srcList.push(this.imgList[i]);
    },
    goBack() {
      this.$router.go(-1);
    },

    //编辑缴纳项目
    onEdit(info) {
      this.form = JSON.parse(JSON.stringify(info));
      this.dialogEdit = true;
    },

    //新增基数
    addBasic() {
      //离职不能操作
      if (this.userDetail.jobStatus == 3) {
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      this.$set(this.form, "basic", "");
      this.$set(this.form, "companyVal", "");
      this.$set(this.form, "defaultVal", "");
      this.$set(this.form, "paymentType", "");
      this.$set(this.form, "paymentName", "");
      this.$set(this.form, "paymentId", "");
      this.$set(this.form, "personVal", "");
      this.$set(this.form, "companyPaymentId", "");
      this.dialogFormVisible = true;
    },
    //选择项目类别
    paymentChange(e) {
      let data = this.areaPaymentOptions.filter((a) => {
        return a.paymentItemType == e;
      });
      if (data.length > 0) {
        for (let index = 0; index < data.length; index++) {
          data[index].paymentTypeId = data[index].paymentItemType;
        }

        this.baseList = data;
      } else {
        this.$message.warning("暂无对应缴纳项目，请先添加");
        return;
      }
    },

    //获取缴纳项目比例的金额
    getPaymentAmount() {
      if (this.basicInfoTable.length > 0) {
        //paymentType==1 比例
        //paymentItemType==1 社保 paymentItemType==2 公积金
        //userDetail.socialSecurityBasic 社保基数 userDetail.fundBasic 公积金基数
        for (let index = 0; index < this.basicInfoTable.length; index++) {
          //比例
          if (this.basicInfoTable[index].paymentType == 1) {
            //社保/公积金
            if (
              this.basicInfoTable[index].paymentItemType == 1 ||
              this.basicInfoTable[index].paymentItemType == 2
            ) {
              //基数
              let baseVal = 0;

              let companyVal =
                base.accDiv(this.basicInfoTable[index].companyVal, 100) || 0;

              let personVal = base.accDiv(this.basicInfoTable[index].personVal, 100) || 0;
              //社保
              if (this.basicInfoTable[index].paymentItemType == 1) {
                baseVal = this.userDetail.socialSecurityBasic || 0;
              } else if (this.basicInfoTable[index].paymentItemType == 2) {
                //公积金
                baseVal = this.userDetail.fundBasic || 0;
              }

              let companyAmount = base.accMul(baseVal, companyVal);
              let personAmount = base.accMul(baseVal, personVal);

              if (this.basicInfoTable[index].paymentItemType == 2) {
                //公积金四舍五入取整
                companyAmount = Number(companyAmount.toFixed(0));
                personAmount = Number(personAmount.toFixed(0));
              } else if (this.basicInfoTable[index].paymentItemType == 1) {
                //社保四舍五入保留2位小数
                companyAmount = Number(companyAmount.toFixed(2));
                personAmount = Number(personAmount.toFixed(2));
              }

              //修改表格基数
              this.$set(this.basicInfoTable[index], "basic", baseVal);
              this.$set(this.basicInfoTable[index], "companyAmount", companyAmount);
              this.$set(this.basicInfoTable[index], "personAmount", personAmount);
            } else {
              //其他项目
              if (this.basicInfoTable[index].paymentType == 1) {
                //基数
                let baseVal = this.basicInfoTable[index].basic || 0;

                let companyVal =
                  base.accDiv(this.basicInfoTable[index].companyVal, 100) || 0;
                let personVal =
                  base.accDiv(this.basicInfoTable[index].personVal, 100) || 0;

                let companyAmount = base.accMul(baseVal, companyVal) || 0;
                let personAmount = base.accMul(baseVal, personVal) || 0;
                //四舍五入保留2位小数
                companyAmount = Number(companyAmount.toFixed(2));
                personAmount = Number(personAmount.toFixed(2));

                this.$set(this.basicInfoTable[index], "companyAmount", companyAmount);
                this.$set(this.basicInfoTable[index], "personAmount", personAmount);
              } else {
                this.$set(this.basicInfoTable[index], "companyAmount", 0);
                this.$set(this.basicInfoTable[index], "personAmount", 0);
              }
            }
          } else {
            //值
            this.$set(this.basicInfoTable[index], "companyAmount", 0);
            this.$set(this.basicInfoTable[index], "personAmount", 0);
          }
        }
      }
    },
    //获取详情
    getData() {
      var reqData = {
        personId: this.$route.query.personId,
      };
      let reqReport = reqRep({ traCode: "_GET_PERSON", data: reqData });
      requestApiPost(reqReport).then((data) => {
        this.homeLoading = false;
        this.loading = false;
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.userDetail = JSON.parse(JSON.stringify(resReport.data));

          this.getPlatform();
          //工资
          this.$set(this.userDetail, "wage", this.userDetail.basicWages);

          //已有的缴纳项目列表
          this.basicInfoTable = this.userDetail.basicInfo || [];
          this.baseList = this.basicInfoTable;

          //筛选出社保、公积金的取值范围
          for (let index = 0; index < this.basicInfoTable.length; index++) {
            //社保基数赋值
            if (this.basicInfoTable[index].paymentItemType == 1) {
              this.socialSecurityBasicValMax = this.basicInfoTable[index].baseValMax || 0;
              this.socialSecurityBasicValMin = this.basicInfoTable[index].baseValMin || 0;
            }

            //公积金基数赋值
            if (this.basicInfoTable[index].paymentItemType == 2) {
              this.fundBasicValMax = this.basicInfoTable[index].baseValMax || 0;
              this.fundBasicValMin = this.basicInfoTable[index].baseValMin || 0;
            }
          }

          this.getPaymentAmount();

          //赋值基础信息
          this.fullName = this.userDetail.fullName;
          this.isPayFund = this.userDetail.isPayFund == 1 ? true : false;
          this.isPaySocialSecurity =
            this.userDetail.isPaySocialSecurity == 1 ? true : false;
          this.imgList = [
            this.userDetail.idCardFrontPhotoPath,
            this.userDetail.idCardBackPhotoPath,
            this.userDetail.residenceBookMainPath,
            this.userDetail.residenceBookPersonalPath,
            this.userDetail.personPhotoPath,
          ];
        }
      });
    },
    //获取缴纳城市
    getCity() {
      var reqData = {
        grade: 1,
        isStart: 0,
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({ traCode: "_LIST_AREA", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.cityOptions = resReport.data.records;
        }
      });
    },
    //获取平台
    getPlatform() {
      var reqData = {
        PName: "",
        areaCode: this.userDetail.areaCode ? this.userDetail.areaCode : "",
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({ traCode: "_LIST_PAY_PLATFORM", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.platformOptions = resReport.data.records;
        }
      });
      this.getAreaPayment();
    },
    //上传
    upImg(e, type) {
      let that = this;
      switch (type) {
        case 1:
          this.isLoading1 = true;
          break;
        case 2:
          this.isLoading2 = true;
          break;
        case 3:
          this.isLoading3 = true;
          break;
        case 4:
          this.isLoading4 = true;
          break;
        case 5:
          this.isLoading5 = true;
          break;
      }
      requestApiFilePost(e.target.files[0]).then((data) => {
        e.target.value = "";
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          switch (type) {
            case 1:
              this.isLoading1 = false;
              break;
            case 2:
              this.isLoading2 = false;
              break;
            case 3:
              this.isLoading3 = false;
              break;
            case 4:
              this.isLoading4 = false;
              break;
            case 5:
              this.isLoading5 = false;
              break;
          }
          if (type == 1) {
            that.$set(
              that.userDetail,
              "personPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "personPhotoId", resReport.data.fileId);
          } else if (type == 2) {
            that.$set(
              that.userDetail,
              "idCardFrontPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "idCardFrontPhotoId", resReport.data.fileId);
          } else if (type == 3) {
            that.$set(
              that.userDetail,
              "idCardBackPhotoPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "idCardBackPhotoId", resReport.data.fileId);
          } else if (type == 4) {
            that.$set(
              that.userDetail,
              "residenceBookMainPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "residenceBookMainId", resReport.data.fileId);
          } else if (type == 5) {
            that.$set(
              that.userDetail,
              "residenceBookPersonalPath",
              resReport.data.filePath + "?" + new Date().getTime()
            );
            that.$set(that.userDetail, "residenceBookPersonalId", resReport.data.fileId);
          }
          this.imgList = [
            that.userDetail.idCardFrontPhotoPath,
            that.userDetail.idCardBackPhotoPath,
            that.userDetail.residenceBookMainPath,
            that.userDetail.residenceBookPersonalPath,
            that.userDetail.personPhotoPath,
          ];
        }
      });
    },
    //重新提交
    reSubmit() {
      if (!this.userDetail.fullName) {
        this.$message.warning("请输入姓名");
        return;
      }
      if (!this.userDetail.nation) {
        this.$message.warning("请选择民族");
        return;
      }
      if (!base.isCardId(this.userDetail.idCard)) {
        this.$message.warning("身份证号码格式不正确");
        return;
      }
      if (!base.isPoneAvailable(this.userDetail.phone)) {
        this.$message.warning("手机号码格式不正确");
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (this.basicInfoTable.length <= 0) {
        this.$message.warning("请添加缴纳项目");
        return;
      }
      if (!this.userDetail.pId) {
        this.$message.warning("请选择缴纳平台");
        return;
      }

      if (
        this.isPaySocialSecurity &&
        (parseFloat(this.userDetail.socialSecurityBasic) <
          parseFloat(this.socialSecurityBasicValMin) ||
          parseFloat(this.userDetail.socialSecurityBasic) >
          parseFloat(this.socialSecurityBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的社保基数");
        return;
      }

      if (this.isPaySocialSecurity && !this.userDetail.socialSecurityDate) {
        this.$message.warning("请选择社保起缴月份");
        return;
      }
      if (
        this.isPayFund &&
        (parseFloat(this.userDetail.fundBasic) < parseFloat(this.fundBasicValMin) ||
          parseFloat(this.userDetail.fundBasic) > parseFloat(this.fundBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的公积金基数");
        return;
      }

      if (this.isPayFund && !this.userDetail.fundDate) {
        this.$message.warning("请选择公积金起缴月份");
        return;
      }

      var reqData = this.userDetail;
      reqData.PId = this.userDetail.pId;
      reqData.paymentMethod = "2"; //公司全缴
      reqData.basicInfo = this.basicInfoTable;
      reqData.isPayFund = this.isPayFund ? 1 : 2;
      reqData.isPaySocialSecurity = this.isPaySocialSecurity ? 1 : 2;
      reqData.isJobFirst = 0; //0入职；1不入职
      let reqReport = reqRep({ traCode: "_ADD_PERSON_IN_JOB", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.goBack();
        }
      });
    },
    //获取企业区域缴纳项目
    getAreaPayment() {
      var reqData = {
        companyId:
          this.$route.query.companyId ||
          JSON.parse(sessionStorage.getItem("login")).personId,
        areaPaymentId: "",
        areaCode: this.userDetail.areaCode ? this.userDetail.areaCode : "",
        current: 1,
        pageSize: 999,
      };
      let reqReport = reqRep({
        traCode: "_LIST_COMPANY_PAYMENT",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.areaPaymentOptions = resReport.data.records || [];

          /**直接赋值给表格 */
          for (let index = 0; index < this.areaPaymentOptions.length; index++) {
            this.areaPaymentOptions[index].paymentTypeId = this.areaPaymentOptions[
              index
            ].paymentItemType;
          }

          if (this.isEdit) {
            this.baseList = this.areaPaymentOptions;
            this.changeType();
          } else {
            //当前城市下的缴纳项目
            this.fullList = this.areaPaymentOptions;
          }
        }
      });
    },
    //修改类型
    changeType() {
      if (this.isEdit) {
        this.basicInfoTable = [];
        this.confirmAdd();
      }
    },
    //新增员工缴纳项目请求
    addPersonPayment(info) {
      info.mappingId = this.$route.query.mappingId;
      let reqReport = reqRep({
        traCode: "_ADD_PERSON_PAYMENT",
        data: info,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },

    //修改员工缴纳项目请求
    editPersonPayment(data) {
      this.updateLoading = true;
      let reqReport = reqRep({
        traCode: "_EDIT_PERSON_PAYMENT",
        data: data,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },
    //删除员工缴纳项目
    onDelete(item, i) {
      if (!item.type || item.type != "add") {
        let isHave = this.deletePaymentList.some((e) => {
          return e.paymentId == item.paymentId;
        });
        if (!isHave) {
          this.deletePaymentList.push(item);
        }
      }
      this.basicInfoTable.splice(i, 1);
    },
    //删除员工缴纳项目请求
    removePersonPayment(mappingPaymentId) {
      let reqReport = reqRep({
        traCode: "_DEL_PERSON_PAYMENT",
        data: {
          mappingPaymentId: mappingPaymentId,
        },
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
          this.submitLoading = false;
        }
      });
    },
    //修改信息
    submit() {
      if (!this.userDetail.fullName) {
        this.$message.warning("请输入姓名");
        return;
      }
      if (!this.userDetail.nation) {
        this.$message.warning("请选择民族");
        return;
      }
      if (!base.isCardId(this.userDetail.idCard)) {
        this.$message.warning("身份证号码格式不正确");
        return;
      }
      if (!base.isPoneAvailable(this.userDetail.phone)) {
        this.$message.warning("手机号码格式不正确");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (!this.userDetail.insuredStatus) {
        this.$message.warning("请选择参保身份");
        return;
      }
      if (!this.userDetail.permanentAddress) {
        this.$message.warning("请输入户籍地址");
        return;
      }
      if (!this.userDetail.address) {
        this.$message.warning("请输入联系地址");
        return;
      }
      if (!this.userDetail.areaCode) {
        this.$message.warning("请选择缴纳城市");
        return;
      }
      if (!this.userDetail.censusRegisterType) {
        this.$message.warning("请选择户籍类型");
        return;
      }
      if (
        this.isPaySocialSecurity &&
        (parseFloat(this.userDetail.socialSecurityBasic) <
          parseFloat(this.socialSecurityBasicValMin) ||
          parseFloat(this.userDetail.socialSecurityBasic) >
          parseFloat(this.socialSecurityBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的社保基数");
        return;
      }

      if (this.isPaySocialSecurity && !this.userDetail.socialSecurityDate) {
        this.$message.warning("请选择社保起缴月份");
        return;
      }

      if (
        this.isPayFund &&
        (parseFloat(this.userDetail.fundBasic) < parseFloat(this.fundBasicValMin) ||
          parseFloat(this.userDetail.fundBasic) > parseFloat(this.fundBasicValMax))
      ) {
        this.$message.warning("请输入符合规则的公积金基数");
        return;
      }

      if (this.isPayFund && !this.userDetail.fundDate) {
        this.$message.warning("请选择公积金起缴月份");
        return;
      }

      this.editInfoRequest();
    },
    /**修改员工信息 */
    editInfoRequest() {
      this.submitLoading = true;
      var reqData = JSON.parse(JSON.stringify(this.userDetail));
      reqData.personId = this.$route.query.personId;
      reqData.mappingId = this.$route.query.mappingId;

      reqData.paymentMethod = "2"; //公司全缴
      reqData.socialSecurityBasic = parseFloat(reqData.socialSecurityBasic) || 0;
      reqData.fundBasic = parseFloat(reqData.fundBasic) || 0;
      reqData.medicalInsuranceBase = parseFloat(reqData.socialSecurityBasic) || 0;

      // reqData.basicInfo = this.basicInfoTable;
      reqData.isPayFund = this.isPayFund ? 1 : 2;
      reqData.payWages=this.isWages?1:2;
      reqData.payingMedicalInsurance=this.isPayMedical?1:2;
      reqData.isPaySocialSecurity = this.isPaySocialSecurity ? 1 : 2;
      reqData.isJobFirst = 0; //0入职；1不入职
      reqData.companyId = this.$route.query.companyId;
      reqData.associatedContracts=this.associatedContracts?1:2;
      //养老金
      reqData.pensionEnterprisePays=this.userDetail.socialSecurityBasic*this.userTemplate.companyRetirementRate*1||0;//企业
      reqData.pensionPersonalPayment=this.userDetail.socialSecurityBasic*this.userTemplate.personRetirementRate*1||0;//个人
      //失业金
      reqData.unemployedCompanyPays=this.userDetail.socialSecurityBasic*this.userTemplate.companyUnemploymentRate*1||0;//企业
      reqData.unemployedIndividualsPay=this.userDetail.socialSecurityBasic*this.userTemplate.personUnemploymentRate*1||0;//个人
      //工伤赔偿
      reqData.workersCompensationCompany=this.userDetail.socialSecurityBasic*this.userTemplate.companyNdustrialInjuryRate*1||0;//工伤赔偿公司
      //伤残保险公司赔付
      reqData.disabilityInsuranceCompanyPays=this.userDetail.socialSecurityBasic*this.userTemplate.companyDisabilityBenefitsRate*1||0;//公司残障福利费率
      //医疗保险
      reqData.paidByMedicalInsuranceCompanies=this.userDetail.medicalInsuranceBase*this.userTemplate.companyMedicalRate*1||0;//企业
      reqData.medicareIndividualPayouts=this.userDetail.medicalInsuranceBase*this.userTemplate.personMedicalRate*1||0;//个人
      //公积金
      reqData.fundCompanyPayment=this.userDetail.fundBasic*this.userTemplate.companyFundRate*1||0;
      reqData.fundPersonPayment=this.userDetail.fundBasic*this.userTemplate.personFundRate*1||0;

      reqData.hireType=1;

      reqData.idCardFrontPhotoId=this.userDetail.idCardFrontPhotoPath;
      reqData.idCardBackPhotoId=this.userDetail.idCardBackPhotoPath;
      reqData.residenceBookMainId=this.userDetail.residenceBookMainPath;
      reqData.residenceBookPersonalId=this.userDetail.residenceBookPersonalPath;
      reqData.personPhotoId=this.userDetail.personPhotoPath;

      let reqReport = reqRep({ traCode: "_EDIT_PERSON_V2_3", data: reqData });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.submitLoading = false;
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.$message({
            message: "保存成功",
            type: "success",
          });
          this.goBack();
          this.submitLoading = false;
        }
      });
    },
    valueFormatter(a, b, c) {
      if (c > 0) {
        return c + "%";
      } else {
        return "0";
      }
    },
    paymentTypeIdFilter(a, b, c) {
      return this.itemClassification[c].label;
    },
    signFormatter(a, b, c) {
      return c + "元";
    },
    cls() {
      this.userDetail = {
        fullName: "",//姓名
        idCardNo: "",//身份证
        nation: "汉族",//民族
        gender: 1,//性别
        phoneNumber: "",//手机号
        typeOfHouseholdRegistration: 1,//户籍类型
        insuredStatus: 0,//参保身份
        typeOfWork: 0,//职工工种
        registeredAddress: "",//户籍地址
        education: 0,//最高学历
        address: "",//联系地址

        isLocalSocialSecurity: 0,//当地社保
        areaCode: "",//缴纳城市
        platformId: 0,//缴纳平台
        /*社保*/
        socialSecurityAccount: "",//社保账号
        socialSecurityBasic: "",//社保基数
        socialSecurityDate: "",//社保起缴月份
        companyRetirementRate: "",//社保养老企业支付
        personRetirementRate: "",//社保养老个人支付
        companyUnemploymentRate: "",//社保失业公司支付
        personUnemploymentRate: "",//社保失业个人支付
        companyNdustrialInjuryRate: "",//社保工伤公司支付
        companyDisabilityBenefitsRate: "",//社保残保金公司支付
        /*医保*/
        medicalBase: "",//医保基数
        companyMedicalRate: "",//医保企业支付
        personMedicalRate: "",//医保个人支付
        /*公积金*/
        fundAccount: "",//公积金账号
        fundBasic: "",//公积金基数
        companyFundRate: "",//公积金企业支付
        personFundRate: "",//公积金个人支付
        fundDate: "",//公积金起缴月份
        /*工资*/
        wages: "",//工资
        /*合同*/
        contractNumber:"",//合同编号
        /*证件照片*/
        idCardFrontPhotoPath:"",//身份证正面照片(头像面)
        idCardBackPhotoPath:"",//身份证反面照片(国徽面)
        residenceBookMainPath:"",//户口本主页
        residenceBookPersonalPath:"",//户口本个人页
        personPhotoPath:"",//二寸白底免冠照

      };
    },
    initData() {
      this.cls();
      var reqData = {
        companyId: this.$route.query.companyId,
        personId: this.$route.query.personId,
        auditStatus: this.auditInfo.auditStatus,
        mappingPersonId: this.$route.query.mappingPersonId
      };
      console.log(reqData);
      let reqReport = reqRep({
        traCode: "_GET_PERSON_V2_3",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.userDetail = resReport.data;
          this.homeLoading = false;
          this.getPlatform();
          this.isPayFund=this.userDetail.paySocialSecurity==1?true:false;
          this.isWages=this.userDetail.payWages==1?true:false;
          this.isPaySocialSecurity=this.userDetail.paySocialSecurity==1?true:false;
          this.isPayMedical=this.userDetail.payingMedicalInsurance==1?true:false;
          this.initRateData();
        }
      });
    },
    initRateData() {
      var reqData = {
        companyId: this.$route.query.companyId,
        personId: ""
      };
      let reqReport = reqRep({
        traCode: "_GET_PERSON_V2_3",
        data: reqData,
      });
      requestApiPost(reqReport).then((data) => {
        let resReport = resRep(data);
        if (resReport.getReCode() != "0000") {
          this.$message({
            message: resReport.getReMsg(),
            type: "error",
          });
        } else {
          this.userTemplate = resReport.data;
        }
      });
    }
  },
  filters: {
    dateFilter(val) {
      if (val) {
        return base.timeSwitch(val);
      }
    },
    monthFilter(val) {
      if (val) {
        return base.monthSwitch(val);
      }
    },
  },
  created() {
    this.insuredStatusOptions = commonData.insuredStatusOptions;
    this.typeOfWorkOptions = commonData.typeOfWorkOptions;
    this.nationOptions = commonData.nationOptions;
    this.educationOptions = commonData.educationOptions;
    this.censusOptions = commonData.censusOptions;
    console.log(this.censusOptions);
    this.itemClassification = commonData.itemClassification;

    //待删除缴纳项目数组
    this.deletePaymentList = [];

    this.homeLoading = true;
    this.getCity();

    // this.getData();

    if (sessionStorage.getItem("auditInfo")) {
      this.auditInfo = JSON.parse(sessionStorage.getItem("auditInfo"));
      if (this.auditInfo.auditStatus != "1") {
        this.remarkList =
          this.auditInfo.auditResult && JSON.parse(this.auditInfo.auditResult);
      } else {
        this.remarkList = [];
      }
    }

    this.initData();
  },
};
</script>
<style scoped>
.header {
  padding: 15px;
  height: 50px;
  box-sizing: border-box;
  font-size: 14px;
  border-bottom: 1px solid #eee;
}

.header i {
  margin-right: 5px;
}

.back {
  display: inline-block;
  cursor: pointer;
}

.add {
  float: right;
  color: #666;
  cursor: pointer;
}

.add:hover {
  color: #13cb6e;
}

.input-box .el-input,
.input-box .el-select,
.main .el-input,
.main .el-select {
  width: 228px;
}

.icontongzhi {
  font-size: 14px;
  font-weight: bold;
  margin-right: 5px;
}

.leave {
  padding: 15px;
}

.leave .message {
  color: #f56c6c;
  display: inline-block;
  line-height: 34px;
}

.leave .normal {
  color: #666;
  display: inline-block;
  line-height: 34px;
}

.leave-pointer {
  float: right;
}

.leave-pointer span {
  color: #13cb6e;
  margin-left: 20px;
  line-height: 34px;
  cursor: pointer;
}

.leave-pointer i {
  font-weight: bold;
  padding-right: 5px;
}

.leave-pointer .btn {
  height: 34px;
  line-height: 14px;
  padding: 8px;
  color: #fff;
  background-color: #13cb6e;
}

.change {
  display: inline-block;
  cursor: pointer;
  padding: 20px 20px 0;
}

.change i {
  color: #13cb6e;
  font-weight: bold;
  vertical-align: top;
}

.change:hover {
  color: #13cb6e;
}

.p-t-lg {
  padding: 30px 44px;
  border-top: 1px solid #eee;
}

header .title {
  display: inline-block;
  font-size: 18px;
}

header .is-open {
  float: right;
}

header .edit {
  float: right;
  color: #666;
  cursor: pointer;
}

.edit:hover {
  color: #13cb6e;
}

.edit i {
  vertical-align: bottom;
}

.main {
  margin-top: 30px;
}

.main>section {
  float: left;
  padding-bottom: 15px;
  width: 50%;
}

.main span {
  font-size: 14px;
  color: #999;
}

.main>section span:first-child {
  display: inline-block;
  width: 120px;
}

.warn {
  color: #f56c6c;
}

.main .value {
  padding-left: 5px;
  color: #666;
}

.family {
  padding: 10px 20px;
  background-color: #eee;
  border-radius: 3px;
}

.family .info {
  display: inline-block;
}

.info .f-name,
.word-address {
  color: #666 !important;
}

.info li {
  margin-bottom: 5px;
}

.info span {
  display: inline-block;
  margin-right: 20px;
}

.family .operation {
  float: right;
  text-align: right;
}

.operation>span {
  margin-left: 20px;
  display: inline-block;
  cursor: pointer;
}

.operation>span:hover {
  color: #13cb6e;
}

.img-bj {
  position: relative;
  width: 225px;
  height: 135px;
  border-radius: 4px;
  margin: 0 10px 10px 0;
  background-color: #eee;
}

.img-head {
  position: relative;
  width: 108px;
  height: 135px;
  border-radius: 4px;
  margin: 0 10px 10px 0;
  background-color: #eee;
}

.img-box p {
  color: #999;
  font-size: 12px;
}

.img-box {
  float: left;
  margin: 0 10px 10px 0;
}

.img-box .tip-head {
  color: #999;
  width: 108px;
  margin: 0 10px 10px 0;
}

.img-box .upBtn {
  margin-top: 10px;
  position: relative;
  width: 50px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  color: #fff;
  border-radius: 4px;
  cursor: pointer;
  background-color: #13cb6e;
}

.img-box .upBtn input {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
}

.explain {
  color: #999;
  margin-top: 10px;
}

.box {
  margin-right: 40px;
  margin-bottom: 20px;
}

.input-box {
  position: relative;
  float: left;
  width: 50%;
  margin-bottom: 22px;
}

.input-box .title,
.box .title {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  width: 113px;
  color: #666;
}

.tip {
  color: #f56c6c;
  font-size: 12px;
  padding-left: 120px;
  text-align: center;
  margin-bottom: 4px;
}

.input-box .value {
  display: inline-block;
  width: 228px;
}

.input-box p {
  padding-top: 4px;
  padding-left: 146px;
  font-size: 12px;
  color: #999;
}

.data-range {
  position: absolute;
  bottom: -18px;
  left: 146px;
  font-size: 12px;
  color: #f56c6c;
}

.button-box {
  clear: both;
  border-top: 1px solid #eee;
  padding: 30px;
}

.button-box>div {
  display: inline-block;
  min-width: 50px;
  padding: 8px 10px;
  border-radius: 3px;
  text-align: center;
  cursor: pointer;
}

.table {
  margin-top: 20px;
}
</style>
